<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"> 
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>YUYOO Map on GOOGLE MAP API </title>
	<script src="http://ditu.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA7TbEJS9dipb7_jr_rXImKBSkjhb-bNRsK7U-sv9Cc7E90_tFoxRh6pCqOylURdC--03sqwTFX8HGqw&hl=zh-CN"
            type="text/javascript"></script> 
    <script type="text/javascript">

    //<![CDATA[
	

    function load() {

	  var p_tianhe = new GLatLng(23.130415047434663, 113.3294422485809326);
	  var p_turn1 = new GLatLng(23.130415047434663, 113.32830905914306);
	  var p_well7 = new GLatLng(23.12248224483736, 113.3280086517334);
	  var p_well6 = new GLatLng(23.11893009164808, 113.32878112792969);
	  var p_well5 = new GLatLng(23.11861434014759, 113.33264350891113);
	  var p_well4 = new GLatLng(23.118219649727315, 113.3364200592041);
	  var p_well3 = new GLatLng(23.117785488924376, 113.34161281585693);
	  var p_well2 = new GLatLng(23.117351326716992, 113.34457397460937);
	  var p_turn2 = new GLatLng(23.11712437773144, 113.34772825241089);
	  var p_turn3 = new GLatLng(23.116404058844146, 113.34770679473877);
	  var p_turn4 = new GLatLng(23.119048498269233, 113.32796573638916);
	  var p_tancun = new GLatLng(23.116404058844146, 113.34847927093506);
	  
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(23.12248224, 113.3385229), 15);
		
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl()); 
		
		var markerOpt_s = { title:'tian he station'};
		var marker_s = new GMarker(p_tianhe, markerOpt_s);

		GEvent.addListener(marker_s, "click", function() {
							marker_s.openInfoWindowHtml("<div>Outer face: 32.00 C <br> Inner conductor: 38:00 C <br>Peak: 0.2 <br> Ampere: 2000A</div>");
						  });

		var markerOpt_e = { title:'tian he station'};
		var marker_e = new GMarker(p_tancun, markerOpt_e);

		GEvent.addListener(marker_e, "click", function() {
							marker_e.openInfoWindowHtml("<div>Outer face: 32.00 C <br> Inner conductor: 38:00 C <br>Peak: 0.2 <br> Ampere: 2000A</div>");
						  });

		map.addOverlay(marker_s);
		map.addOverlay(marker_e);

		// 创建“微型”标记图标
        var tinyIcon = new GIcon();
        tinyIcon.image = "http://labs.google.com/ridefinder/images/mm_20_blue.png";
        tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
        tinyIcon.iconSize = new GSize(12, 20);
        tinyIcon.shadowSize = new GSize(22, 20);
        tinyIcon.iconAnchor = new GPoint(6, 20);
        tinyIcon.infoWindowAnchor = new GPoint(5, 1);
        
        // 设置 GMarkerOptions 对象
        markerOpt_m = { icon:tinyIcon };

		var marker_7 = new GMarker(p_well7, markerOpt_m);		
		var marker_6 = new GMarker(p_well6, markerOpt_m);	
		var marker_5 = new GMarker(p_well5, markerOpt_m);	
		var marker_4 = new GMarker(p_well4, markerOpt_m);	
		var marker_3 = new GMarker(p_well3, markerOpt_m);	
		var marker_2 = new GMarker(p_well2, markerOpt_m);
		map.addOverlay(marker_7);
		map.addOverlay(marker_6);
		map.addOverlay(marker_5);
		map.addOverlay(marker_4);
		map.addOverlay(marker_3);
		map.addOverlay(marker_2);
		
		GEvent.addListener(marker_7, "click", function() {
							marker_7.openInfoWindowHtml("<div>Outer face: 32.00 C <br> Inner conductor: 38:00 C <br>Peak: 0.2 <br> Ampere: 2000A</div>");
						  });
		
		GEvent.addListener(marker_6, "click", function() {
							marker_6.openInfoWindowHtml("<div>Outer face: 32.00 C <br> Inner conductor: 38:00 C <br>Peak: 0.2 <br> Ampere: 2000A</div>");
						  });
		
		GEvent.addListener(marker_5, "click", function() {
							marker_5.openInfoWindowHtml("<div>Outer face: 32.00 C <br> Inner conductor: 38:00 C <br>Peak: 0.2 <br> Ampere: 2000A</div>");
						  });
		
		GEvent.addListener(marker_4, "click", function() {
							marker_4.openInfoWindowHtml("<div>Outer face: 32.00 C <br> Inner conductor: 38:00 C <br>Peak: 0.2 <br> Ampere: 2000A</div>");
						  });
		
		GEvent.addListener(marker_3, "click", function() {
							marker_3.openInfoWindowHtml("<div>Outer face: 32.00 C <br> Inner conductor: 38:00 C <br>Peak: 0.2 <br> Ampere: 2000A</div>");
						  });
		
		GEvent.addListener(marker_2, "click", function() {
							marker_2.openInfoWindowHtml("<div>Outer face: 32.00 C <br> Inner conductor: 38:00 C <br>Peak: 0.2 <br> Ampere: 2000A</div>");
						  });
			 
	    map.openInfoWindow(marker_2, '#?');

		var polyline = new GPolyline([
						  p_tianhe,p_turn1,p_well7,p_turn4,p_well6,p_well5,p_well4,
						  p_well3,p_well2,p_turn2,p_turn3,p_tancun],
						  "#ff0000", 5);
		map.addOverlay(polyline);
		/*
		GEvent.addListener(map,"click", function(overlay,point) {     
			  var myHtml = "GPoint: " + map.fromLatLngToDivPixel(point);
			  var cp = point;
			  var xp = cp.x;
			  var yp = cp.y;
			  myHtml += " xp:" + xp + ", yp:" + yp; 
			  map.openInfoWindow(point, myHtml);
				
			});
			*/
	  }
    }

    //]]>
    </script>
  </head>
  <body onload="load()" onunload="GUnload()">
    <div id="map" style="width: 800px; height: 400px"></div>
    <div id="stats" style="width: 800px; height: 258px">
		
				<embed src="topStatsBar.swf" quality="high" bgcolor="#869ca7"
					width="100%" height="100%" name="topStatsBar" align="middle"
					play="true"
					loop="false"
					quality="high"
					allowScriptAccess="sameDomain"
					type="application/x-shockwave-flash"
					pluginspage="http://www.adobe.com/go/getflashplayer">
				</embed>
	</div> 
  </body>
</html>